<template>
    <a-tabs lazy-load default-active-key="1">
    <a-tab-pane key="1">
      <template #title>
        <icon-calendar/>旅游
      </template>
        <paneList></paneList>
    </a-tab-pane>
    <a-tab-pane key="2">
      <template #title>
        <icon-clock-circle/> 美食
      </template>
      Content of Tab Panel 2
    </a-tab-pane>
    <a-tab-pane key="3">
      <template #title>
        <icon-user/> 知识
      </template>
      Content of Tab Panel 3
    </a-tab-pane>
  </a-tabs>
</template>

<script setup lang='ts'>
import { ref } from "vue"
import { loadMaskStore } from '@/stores/loadMask'
import paneList from "@/components/home/pane-list.vue";

const store = loadMaskStore()
const show = (()=>{
  store.open()
})
</script>

<style lang="scss" scoped>
:deep .arco-tabs-tab-active{
  color: white !important;
}
:deep .arco-tabs-nav-ink{
  background-color: black;
}

</style>
